<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>魁拔论坛放映厅</title>
    <link href="css/kb_main.css" rel="stylesheet" type="text/css"/>
    <link href="css/header.css" rel="stylesheet" type="text/css"/>
    <link href="css/vedioPlayer.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="js/main.js"></script>

</head>
<body>
    <header id="main_header">
        <div class="kb_h_con" id="left_menu" onclick="popOut()">
            <img src="img/list.svg"/>
        </div>        
        <a href="#top_sign">
        <div class="kb_h_con" id="logo_con">
            <img id="kb_logo" src="img/logo1.png"/>
        </div></a>

        <div class="kb_h_con" id="kb_center_nav">
            <div id="kb_top_menu">
                <ul>
                    <li><a href="#">
                        <img id="kb_top_search" src="img/search.svg" onclick="popSearchBox()"/></a>
                    </li>
                    <li><a href="index.htm">首页</a></li>
                    <li><a href="playVedio.htm">放映</a></li>
                    <li><a href="new.htm">公告</a></li>
                </ul>
            </div>
        </div>

        <div id="kb_search_box">
            <img src="img/back.svg"onclick="leftSearchBox()"/>
            <input placeholder="搜索"/>
        </div>

        <div class="kb_h_con" id="h_user">
            <div id="h_user_no" style="display: none;"><span>登陆</span></div>
            <div id="h_user_yes" onclick="popUserInfo()"><img src="img/ht/ms2.jpg"/></div>
        </div>

        <div id="kb_user_info" onclick="leftUserInfo()">
            <div class="kb_user_infoCon" id="kb_infoCon_main">
                <div><img src="img/ht/ms2.jpg"/><span><img class="kb_icon" src="img/list.svg"/></div>
                <p>用户名称</span></p>
                <a href="#moreInfo">
                    <button type="button">更多设置</button>
                </a>
            </div>
            <div class="kb_user_infoCon"></div>
            <div class="kb_user_infoCon"></div>
        </div>

        <div id="menu_list" onclick="popIn()">
            <ul>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">首页</div>
                </li>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">项目</div>
                </li>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">项目</div>
                </li>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">项目</div>
                </li>                      
            </ul>

            <ul>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">项目</div>
                </li>
                <li class="menu_list_con">
                    <img class="kb_list_icon" src="img/list.svg"/>
                    <div class="kb_menu_name">项目</div>
                </li>                 
            </ul>

        </div>
    </header>
    <div id="top_sign"></div>
    
    <div class="kb_vedio_con" id="kb_vedio_box">
        <iframe id="kb_vedio_iframe" src="https://player.bilibili.com/player.html?bvid=BV1Fx411v7n9" allowfullscreen="allowfullscreen" width="100%" height="100%" scrolling="no" frameborder="0"></iframe>    </div>
    <div class="kb_vedio_con" id="kb_vedio_menu">
        <button id="kb_vm_b1" onclick="show(vm_hiden_list[0]);">魁拔大电影</button>
        <button id="kb_vm_b2" onclick="show(vm_hiden_list[1]);">魁拔妖侠传</button>
        <button id="kb_vm_b3">魁拔之殊途（暂未引入）</button>
    </div>
    <div class="kb_vedio_con" id="kb_vedio_list">
        
        <ul id="kb_vedio_listA">
            <li onclick="changeSource(kb_vedioVB_m[0]);">十万火急</li>
            <li onclick="changeSource(kb_vedioVB_m[1]);">大战元泱界</li>
            <li onclick="changeSource(kb_vedioVB_m[2]);">战神崛起</li>
        </ul>
        <ul id="kb_vedio_listB">
            <li onclick="changeSource(kb_vedioVB_yxz + '1');">P1</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '2');">P2</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '3');">P3</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '4');">P4</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '5');">P5</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '6');">P6</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '7');">P7</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '8');">P8</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '9');">P9</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '10');">P10</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '11');">P11</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '12');">P12</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '13');">P13</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '14');">P14</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '15');">P15</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '16');">P16</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '17');">P17</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '18');">P18</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '19');">P19</li>
            <li onclick="changeSource(kb_vedioVB_yxz + '20');">P20</li>
        </ul>
        <ul id="kb_vedio_listC">
            <li>P1</li><li>P2</li><li>P3</li>
        </ul>
    </div>
    <div class="kb_vedio_con" id="kb_vedio_info">
        <p>魁拔论坛放映大厅可以观看魁拔大电影三部于魁拔妖侠传后期会有魁拔之殊途加入。</p>
    </div>

    <footer>
        <p>魁拔论坛@2021</p>
        <section>         
            <ul>
                <li><span>友情链接：</span></li>
                <li><a href="#footer">链接一</a></li>
                <li><a href="#footer">链接二</a></li>
                <li><a href="#footer">链接三</a></li>
            </ul>
            <p>Powered by Discuz! X3.4</p>
        </section>
        <section>
            <p>备案信息放置区：<a href="#footer">备案号</a></p>
        </section>
    </footer>

    <script>
        var kb_vedioVB_m = ["BV1Kx411w71c", "BV1Jx411Y7AB&page=1", "BV1Cx411e7Vt"];
        var kb_vedioVB_yxz = "BV1Fx411v7n9&&page=";
        var vm_hiden_list = [
            document.getElementById("kb_vedio_listA"),
            document.getElementById("kb_vedio_listB"),
            document.getElementById("kb_vedio_listC")
        ];
        function hiden_vm() {
            for(i = 0; i < 3; i++) vm_hiden_list[i].style.display = "none";
        }
        function show(something) {
            hiden_vm();
            something.style.display = "inline";
        }
        function changeSource(bv) {
            bv = 'https://player.bilibili.com/player.html?bvid=' + bv;
            document.getElementById("kb_vedio_iframe").src = bv;
        }
        
    </script>
</body>
</html>